<!--// 申诉审核结果查看-->
<template>
  <div>
  <el-dialog title="申诉审核" :close-on-click-modal="false" :visible.sync="viewShow">
    <el-main>
        <el-col :span="12">
          <div style="font-size: larger;">{{appealStatus?"复核申诉内容":"申诉内容"}}</div>
          <div v-if="(valueAppealContentVo.appealContent===1 || valueAppealContentVo.appealContent===2)" style="margin-top: 30px;color: #0000cc">管家评价结果</div>
          <div v-if="(valueAppealContentVo.appealContent===1 || valueAppealContentVo.appealContent===3)" style="color: #0000cc">益伴价值观管理小组评价结果</div>
          <div style="font-size: larger;margin-top: 30px">申诉说明</div>
          <div style="margin-top: 10px"><span class="grid-content bg-purple">{{valueAppealContentVo.appealDescribe}}</span></div>
          <div class="imgContent" v-html="imgHandle(valueAppealContentVo.appealImg)"></div>

<!--          复核情况 首次申诉内容-->
          <div v-if="appealStatus" style="margin-top: 30px">
            <div style="font-size: larger;">首次申诉结果</div>
            <div style="color: #0000cc;margin-top: 10px">
              <span>{{valueAppealContentVo.firstAppealStatus ===0 ?"申诉中":""}}</span>
              <span>{{valueAppealContentVo.firstAppealStatus ===1 ?"申诉成功":""}}</span>
              <span>{{valueAppealContentVo.firstAppealStatus ===2 ?"申诉失败":""}}</span>
              <span>{{valueAppealContentVo.firstAppealStatus ===3 ?"申诉超时":""}}</span>
            </div>
            <div style="font-size: larger;margin-top: 30px;">首次申诉内容</div>
            <div v-if="(valueAppealContentVo.firstAppealContent===1 || valueAppealContentVo.firstAppealContent===2)" style="margin-top: 30px;color: #0000cc">管家评价结果</div>
            <div v-if="(valueAppealContentVo.firstAppealContent===1 || valueAppealContentVo.firstAppealContent===3)" style="color: #0000cc">益伴价值观管理小组评价结果</div>
            <div style="font-size: larger;margin-top: 30px">申诉说明</div>
            <div style="margin-top: 10px"><span class="grid-content bg-purple">{{valueAppealContentVo.firstAppealDescribe}}</span></div>
            <div class="imgContent" v-html="imgHandle(valueAppealContentVo.appealImg)"></div>
          </div>
        </el-col>
        <el-col :span="12" style="border-left: 1px solid #C5C5C5;">
<!--       运营评价-->
          <div v-if="(valueAppealContentVo.appealContent===1 || valueAppealContentVo.appealContent===3)" style="margin-left: 30px">
            <div style="font-size: larger;">运营评价</div>
            <div style="margin-top: 30px">运营评价总得分：<span style="color: #0000cc">{{ staffMemberEvaluateResultVo===null?"":staffMemberEvaluateResultVo.totalScore}}</span></div>
            <div v-for="item in staffMemberEvaluateArr" style="margin-top: 30px;">
              <div>{{item.labelTitle}}<span style="color: #0000cc">{{ item.valueScore }}</span> 分</div>
              <div v-if="(item.valueDescribe || item.valueImg)" style="margin-top: 20px;">评分举例说明</div>
              <div style="margin-top: 10px"><span class="grid-content bg-purple">{{item.valueDescribe}}</span></div>
              <div class="imgContent" v-html="imgHandle(item.valueImg)"></div>
              <div v-if="(item.valueDescribe || item.valueImg)" style="border-bottom: 1px solid #C5C5C5"></div>
            </div>
          </div>
<!--          // 管家评价-->
          <div v-if="(valueAppealContentVo.appealContent===1 || valueAppealContentVo.appealContent===2)" style="margin-left: 30px">
            <div style="font-size: larger;margin-top: 30px">管家评价</div>
            <div style="margin-top: 30px">下级评价总得分：<span style="color: #0000cc">{{ valueCommentLogVo===null?"":valueCommentLogVo.totalScore}}</span></div>
            <div v-for="item in valueCommentLogVoArr" style="margin-top: 30px;">
              <div>{{item.labelTitle}}<span style="color: #0000cc">{{ item.valueScore }}</span> 分</div>
              <div v-if="(item.valueDescribe || item.valueImg)" style="margin-top: 20px;">评分举例说明</div>
              <div style="margin-top: 10px"><span class="grid-content bg-purple">{{item.valueDescribe}}</span></div>
              <div class="imgContent" v-html="imgHandle(item.valueImg)"></div>
              <div v-if="(item.valueDescribe || item.valueImg)" style="border-bottom: 1px solid #C5C5C5"></div>
            </div>

          </div>
        </el-col>

    </el-main>
    <span slot="footer" class="dialog-footer">
      <el-button @click="viewShow = false">返回</el-button>
      <el-button @click="reviewFailAction()">申诉驳回</el-button>
      <el-button @click="reviewSuccessAction()">申诉成功</el-button>
    </span>
  </el-dialog>

  <el-dialog title="申诉失败理由" :close-on-click-modal="false" :visible.sync="reviewFailShow">
    <el-form ref="form" :model="form" :rules="dataRule" label-width="200px" style="margin-top: 30px;">
      <el-form-item label="请输入申诉失败的理由:" prop="examineDescribe">
        <el-input class="input" v-model="form.examineDescribe" placeholder="1000字以内" type="textarea" :row="10" maxlength="1000"></el-input>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="reviewFailShow = false">取消</el-button>
      <el-button @click="failReasoonAction()">确定</el-button>
    </span>
  </el-dialog>

    <appeal-result-modify ref="appealModify" @goback="goBack()"></appeal-result-modify>
    <bigimg :bigimgsrc="bigsrc" v-if="showbig" @hideimg="hidebig"></bigimg>
  </div>
</template>

<script>
    import AppealResultModify from "./appealResultModify";
    import bigimg from '@/components/bigimg/index'
    export default {
        name: "appealResultView",
        components: {AppealResultModify,bigimg},
        data () {
            return {
                showbig: false,
                bigsrc:"",
                viewShow: false,
                reviewFailShow:false,
                appealStatus:false, // false 首次申诉  true 复核申诉
                userId:"",
                appealId:"",
                form: {
                    content:"234"
                },

                // 申诉内容
                valueAppealContentVo:{
                    appealContent : "",//"申诉内容类型 1为上级评价+运营评价 2为上级评价 3为运营评价",
                    appealDescribe: "" ,
                    appealImg : [],
                    ratio : "1", //"结算系数,默认1 ",

                    id:"",
                    appealStatus:"",
                    appealType:"",
                    examineDescribe:"",
                    valueId:"",

                },
                staffMemberEvaluateArr:[],
                valueCommentLogVoArr:[],

                // 运营评价
                staffMemberEvaluateResultVo:{},
                // 管家评价
                valueCommentLogVo:{},

                bindData:{},

                // 数据总的对象 由各个对象组成 传值用
                dataObject:{},

                dataRule: {
                  examineDescribe: [
                        {required: true, message: "理由不能为空", trigger: "blur"}
                    ],
                }


            };
        },
        methods: {
            init (appealId,appealStatus) {

                this.bindData = {};
                this.staffMemberEvaluateResultVo = {};
                this.valueCommentLogVo = {};
                this.valueAppealContentVo = {};
                this.staffMemberEvaluateArr = [];
                this.valueCommentLogVoArr = [];

                this.appealStatus = appealStatus
                this.viewShow = true
                this.appealId = appealId
                this.getData()

            },

            getData(){


                let urlStr = "/value/valueappeallog/firstAppealInfo/" + this.appealId;

                if (this.appealStatus) {
                    urlStr = "/value/valueappeallog/secondAppealInfo/" + this.appealId;
                }

                this.$http({
                    url: this.$http.adornUrl(urlStr),
                    method: "get",
                }).then(({ data }) => {

                    if (data && data.code === 0) {

                        this.bindData = data.valueAppealLog;

                        this.valueAppealContentVo = data.valueAppealLog;

                        if (data.valueAppealLog.staffMemberEvaluation) {
                            this.staffMemberEvaluateArr = this.getEvaluateArr(data.valueAppealLog.staffMemberEvaluation);
                            this.staffMemberEvaluateResultVo = data.valueAppealLog.staffMemberEvaluation;
                        }
                        if (data.valueAppealLog.superiorEvaluation) {
                            this.valueCommentLogVoArr = this.getEvaluateArr(data.valueAppealLog.superiorEvaluation);
                            this.valueCommentLogVo = data.valueAppealLog.superiorEvaluation;
                        }

                    } else {

                        this.$message({
                            message: data.msg,
                            type: "error"
                        })
                    }

                });
            },

            getEvaluateArr(object){

                let labelTitleArr = ["用户至上  ","正直坦诚  ","极致执行  ","精进创新  ","团结共赢  "]
                let arr = []

                for (var i = 0;i < 5;i++) {

                    let item = {
                        labelTitle:labelTitleArr[i],
                    }
                    if (i === 0) {
                        // item.valueScore = object.firstValueScore?object.firstValueScore:"";
                        // item.valueDescribe = object.firstValueDescribe?object.firstValueDescribe:"";
                        // item.valueImg = object.firstValueImg?object.firstValueImg:[];
                        item.valueScore = object.firstValueScore;
                        item.valueDescribe = object.firstValueDescribe;
                        item.valueImg = object.firstValueImg;
                    } else if (i === 1) {
                        item.valueScore = object.secondValueScore;
                        item.valueDescribe = object.secondValueDescribe;
                        item.valueImg = object.secondValueImg;

                    } else if (i === 2) {
                        item.valueScore = object.thirdValueScore;
                        item.valueDescribe = object.thirdValueDescribe;
                        item.valueImg = object.thirdValueImg;

                    } else if (i === 3) {

                        item.valueScore = object.fourthValueScore;
                        item.valueDescribe = object.fourthValueDescribe;
                        item.valueImg = object.fourthValueImg;
                    } else if (i === 4) {
                        item.valueScore = object.fifthValueScore;
                        item.valueDescribe = object.fifthValueDescribe;
                        item.valueImg = object.fifthValueImg;
                    }
                  arr.push(item)

                }

                return arr;
            },

            imgHandle(appealImgArr){

                let imgHtml = ''
                if (appealImgArr){

                    if (Array.isArray(appealImgArr)){
                        appealImgArr.map((item) => {
                            imgHtml += `<img src="${item}" style="width: 100px;height:auto;margin: 15px;" @click="setbig(item)">`
                        })
                        return imgHtml
                    }

                }

            },

            // 申诉成功
            reviewSuccessAction(){
                this.viewShow = false
                this.$refs.appealModify.init(this.bindData);
            },

            // 申诉驳回事件
            reviewFailAction() {
                this.form.examineDescribe = ''
                this.viewShow = false;
                this.reviewFailShow = true;

            },

            // 失败理由事件
            failReasoonAction(){


              this.$refs['form'].validate(valid => {
                  if (valid) {

                      this.valueAppealContentVo.appealStatus = "2"
                      this.valueAppealContentVo.appealType = this.appealStatus ? "2" : "1"
                      this.valueAppealContentVo.appealImg = null
                      this.valueAppealContentVo.examineDescribe = this.form.examineDescribe

                      // this.valueAppealContentVo.staffMemberEvaluation = null
                      // this.valueAppealContentVo.superiorEvaluation = null

                      this.$http({
                          url: this.$http.adornUrl("/value/valueappeallog/update"),
                          method: "post",
                          data: this.$http.adornData(this.valueAppealContentVo)
                      }).then(({data}) => {
                          if (data && data.code === 0) {
                              this.$message.success("修改成功");
                              this.reviewFailShow = false;
                              this.goBack();

                          } else {
                              this.$message({
                                  message: data.msg,
                                  type: "error"
                              })
                          }
                      });
                  }

              })

            },

            goBack () {
                this.$emit('goback')
            },

            setbig(imgUrl) {
                this.bigsrc = 'http://thirdwx.qlogo.cn/mmopen/vi_32/Q0j4TwGTfTIWlliaQwAmTODz9ec0tXFUicfhZP9qmJmot4vib7ZC3c9vmqXkSlL21sSHw8IcBLicrazZAGxXszr8FA/132'
                this.bigsrc = imgUrl
                this.showbig = true
            },
            hidebig() {
                this.showbig = false
            },
        }
    }
</script>

<style scoped>
</style>
